<?php
use scenic\assets\AppAsset;
use yii\helpers\Html;
use yii\helpers\Url;
use yii\widgets\LinkPager;

$controller = '使用详情';
$action = '使用详情';
?>

<div class="page-header">
	<h1>
		<?php echo $controller;?>
		<small>
			<i class="ace-icon fa fa-angle-double-right"></i>
			<?php echo $action;?>
		</small>
	</h1>
</div>
<div class="col-xs-12">

	<div  class="grid-view">
		<div class="summary">
			<span>总抽成<b id="J_Total"><?php echo $total;?></b>元,<span  id="J_Pagetotal">该页抽成<b><?php echo $pagetotal?></b>元</span></span>
			<span >景区选择</span>
			<select name="" id="J_Select" style="width:158px;">
				<option value="">请选择景区</option>
				<?php foreach($scenic as $sce):?>
				<option value="<?= $sce->id?>" data-rake="<?= $sce->rake?>"><?= $sce->scenic_name?></option>
				<?php endforeach;?>
			</select>
			
				<div class="col-xs-2">
					<span class="label label-lg label-success arrowed-right">start</span>
					<div class="input-group" style="float：left">
						<input class="form-control date-picker" name="start-time" id="id-date-picker-1" type="text" data-date-format="yyyy-mm-dd"/>
						<span class="input-group-addon">
							<i class="fa fa-calendar bigger-110"></i>
						</span>
					</div>					
				</div>

				<input type="hidden" id="J_Psid" name="scenicid"> 
				<input type="hidden" id="J_Psname" name="scenicname">
				<input type="hidden" id="J_Ptotal" name="total" value="<?php echo $total;?>">
				<input type="hidden" id="J_Prake" name="rake">

				<div class="col-xs-2">				
					<span class="label label-lg label-danger arrowed-right">end</span>
					<div class="input-group" style="float：left">
						<input class="form-control date-picker" name="end-time" id="id-date-picker-1" type="text" data-date-format="yyyy-mm-dd"/>
						<span class="input-group-addon">
							<i class="fa fa-calendar bigger-110"></i>
						</span>
					</div>
				</div>
				<div class="col-xs-2">					
					<button id="J_Export" class="btn btn-primary">导出</button>
				</div>
			
		</div>
		<br>
		<table class="table table-striped table-bordered">
			<thead>
				<tr>
					<th>
						<a href="/index.php/role/index.html?sort=id" data-sort="id">ID</a>
					</th>
					<th>
						<a href="/index.php/role/index.html?sort=scenic_name" data-sort="scenic_name">景区名称</a>
					</th>
					<th>
						<a href="/index.php/role/index.html?sort=scenic_ticket" data-sort="scenic_ticket">设备编码</a>
					</th>
					<th><a href="/index.php/role/index.html?sort=rake" data-sort="rake">抽成(RMB)</a></th>
					<th>创建时间</th>
					<th> 操作</th>
				</tr>
			</thead>
			<tbody id="J_Detail">
			<?php $i='1';?>
			<?php foreach($model as $det):?>
				<tr data-key="<?= $det->id;?>">
					<td><?php echo $i;?></td>
					<td><?php echo $det->scenic_id;?></td>
					<td><?php echo $det->device;?></td>
					<td><?php echo $det->rake;?></td>
					<td><?php echo date('Y-m-d,H:i:s',$det->create_time)?></td>
					<td>
						<a href="<?= Url::to(['detail/view','id'=>$det->id])?>" title="View" aria-label="View" data-pjax="0">
							<span class="glyphicon glyphicon-eye-open"></span>
						</a>
					</td>
				</tr>
				<?php $i++;?>
			<?php endforeach;?>
			</tbody>
		</table>
		<div class="scenic-page">
			<?= LinkPager::widget([
				'pagination'=>$pages,
				'firstPageLabel' => '首页',
				'prevPageLabel' => '上一页',
				'nextPageLabel' => '下一页',
				'lastPageLabel' => '尾页',
			]);?>
		</div>
	</div>
</div>
<script type="text/javascript" src="/scenic/web/ace/js/jquery.js"></script>
<script type="text/javascript" src="/scenic/web/ace/js/date-time/bootstrap-datepicker.js"></script>

<script type="text/javascript">
	
	$("#J_Select").on('change',function(){
		//景区id
		var scenicid = $(this).find('option:selected').val();
		var scenic_name = $(this).find('option:selected').text();
		//抽成
		var rake = $(this).find('option:selected').data('rake');

		$("#J_Psid").val(scenicid);
		$("#J_Psname").val(scenic_name);
		$("#J_Prake").val(rake);
		$.ajax({
			type: 'post',
			url: '<?= Url::to(['detail/sel'])?>',
			data: {_csrf:'<?= Yii::$app->request->csrfToken?>',scenicid:scenicid},
			success:function(response){
				var data = JSON.parse(response);
				var d = data.data;
				$('.scenic-page').hide();
			
				if(d.length == 0) {
					$('#J_Detail').html('该景区暂时没有使用记录');
					$('#J_Pagetotal').html('');
					$('#J_Total').html('0');
					$("#J_Export").attr('disabled',true);
				} else {
					$('#J_Detail').html('');
					$("#J_Export").attr('disabled',false);
					var trs = '';
					for(var i=0; i<d.length; i++){
						var time = d[i].create_time+'000';
						trs += '<tr data-key="'+d[i].id+'">\
									<td>'+d[i].id+'</td>\
									<td>'+scenic_name+'</td>\
									<td>'+d[i].device+'</td>\
									<td>'+rake+'</td>\
									<td>'+DateTotime(parseInt(time))+'</td>\
									<td>\
										<a href="/index.php/role/view.html?id='+d[i].id+'" title="View" aria-label="View" data-pjax="0">\
											<span class="glyphicon glyphicon-eye-open"></span>\
										</a>\
									</td>\
								</tr>';
					}
					$('#J_Detail').append(trs);
					$("#J_Pagetotal").html('');
					$("#J_Total").html(d.length*rake);
					$("#J_Ptotal").val(d.length*rake);
				}			
				
			}
		});
		//时间戳转换
		var DateTotime = function (re){
			var date = new Date(re);

			Y = date.getFullYear() + '-';
			M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
			D = date.getDate() + ' ';
			h = date.getHours() + ':';
			m = date.getMinutes()<10 ? '0'+(date.getMinutes())+':' : date.getMinutes()+':';
			s = date.getSeconds()<10 ? '0'+(date.getSeconds()) : date.getSeconds(); 
			return Y+M+D+h+m+s;
		}
	});
	//导出表格
	$("#J_Export").on("click",function(){
		var scenicid = $("#J_Select").find('option:selected').val();
		var sname = $("#J_Select").find('option:selected').text();
		var rake = $("#J_Select").find('option:selected').data('rake');	
		var total = $("#J_Total").html();
		window.location.href = '/scenic/web/index.php/expor/index.html?scenicid='+scenicid+'&sname='+sname+'&rake='+rake+'&total='+total;
		
		/*$.ajax({
			type: 'post',
			url: '<?= Url::to(['expor/index'])?>',
			data: {_csrf: '<?= Yii::$app->request->csrfToken?>',scenicid:scenicid,total:total,rake:rake,sname:sname},
			success:function(response){
				console.log(response);
			}
		});*/
	});

	//时间样式
	$('.date-picker').datepicker({
		autoclose: true,
		todayHighlight: true
	});
</script>